import { useEffect, useState } from 'react'
import { usePage } from '@hs-admin/utils'
import { HsAdminPage } from '@hs-admin/base-components'
import { postCompanyInfoDetailTalentTeam } from '@/api/companyDetail/BasicInfor'
import head from '/public/static/img/CompanyDetail/light_default_avatar.png'
import { Typography } from 'antd'
const CoreTeam = (props: any) => {
  const { companyCode, hiddenModule } = props

  const { pagination } = usePage(getData)

  const [data, stedata] = useState<any[]>([])

  const { Paragraph } = Typography

  async function getData() {
    const params = {
      companyCode: companyCode || '4baca6ace36657a04ea9180f5e962593',
      current: pagination.current,
      pageSize: pagination.pageSize
    }
    const res = await postCompanyInfoDetailTalentTeam(params)
    if (res.code === 200) {
      const arr = res.data.list.map((item: any) => {
        const arr: any = []
        if (item.labelNameStd && item.labelNameStd !== '未知') {
          arr.push(item.labelNameStd)
        }
        if (item.birthPlace && item.birthPlace !== '未知') {
          arr.push(item.birthPlace)
        }
        if (item.educationOrg && item.educationOrg !== '未知') {
          arr.push(item.educationOrg)
        }
        return {
          ...item,
          tag: arr.length ? arr : []
        }
      })
      stedata(arr)

      if (res.data.total) hiddenModule(true)
    }
    return res.data
  }

  useEffect(() => {
    getData()
  }, [])

  return (
    <div className="coreTeam" id="人才团队">
      <div className="coreTeamCard">
        {data.map((item, index) => (
          <div key={index} className="coreTeamItem">
            <div className="coreTeamItemLeft">
              <img src={item.photourl ? item.photourl : head} alt="" />
            </div>
            <div className="coreTeamItemRight">
              <div className="name">{item.personName}</div>
              <Paragraph ellipsis={{ rows: 3, tooltip: true }}>{item.describer}</Paragraph>
              <Paragraph ellipsis={{ rows: 2, tooltip: true }}>
                <div className="tags">
                  {item.tag.map((tag: any) => (
                    <span className="tag" key={tag}>
                      {tag}
                    </span>
                  ))}
                </div>
              </Paragraph>
            </div>
          </div>
        ))}
      </div>
      <div className="flex justify-end mx-15px">
        <HsAdminPage {...pagination} />
      </div>
    </div>
  )
}
export default CoreTeam
